import React, { Component } from 'react'
import { connect } from 'react-redux'
import { get } from 'utils/http'
import { GenralListContainer } from './../searchPage.style'

@connect(
    state => {
        console.log()
        return ({
            keyword: state.getIn(['search', 'key'])
        })
    },
    null
)

export default class List1 extends Component {
    state = {
        genralList: []
    }
    componentDidMount() {
        this.keyword = localStorage.getItem('keywords')
        this.getGenralList()
    }

    async getGenralList() {
        let general = await get({
            url: `http://h5test.wfdata.club/v1/search/all?keyword=${this.keyword}`,
            headers: {
                'X-Request-Id': 'dgmxgkvRVZg+WaDX0YdMU6N6CO/H3U7PGly02rBHH2ZU6pldHMBk//l5L1Q+RDqF9MYuLFXxaPic0W60EC8gaA==',
                'X-Running-Env': 'Q3OVXEArMgZNlMHtAxpu7ONj6bFtJQXn/rvs04BOX697Tr585tFrKIfZg2KoeUpgvnQYU5SNJ6oll+TA3FcxhCSpa6SvJgmuq4xYqBNA20NJ8ldwleqG5XO+/pJxDWDxaNNMPz7ogAvZMCU05jjILfwfb4xVDID+l4bJCv3PvZscJDIQEUoUSJwLTyrr7tv+gqSf9UY9s9WYRpJ1JOgOJVE/R7GAEfmgKwxF17NRO5ggEi+HSU8VLk4VqV/x4hOj'
            }
        })
        let allgenral = general
        general = general.data.dataList.threadList

        this.setState({
            genralList: general,
            all: allgenral
        })

        // console.log(this.state.genralList)
        console.log(this.state.all)

    }
    liClickHandler = id => {
        this.props.history.push(`/detail/${id}`)
    }

    render() {
        return (
            <GenralListContainer>
                {this.state.all&&this.state.all.data.pageInfo && <div className="result">
                <p>已为您找到 <span>{this.state.all.data.pageInfo.totalPage}</span> 个相关结果</p>
                    <div className="more">
                        <span>查看更多</span>
                        <i className="yo-ico">&#xe60d;</i>
                    </div>
                </div>}
                <ul className="postList">
                    {
                        this.state.genralList.map(item => {
                            return (
                                <li onClick={() => this.liClickHandler(item.tid)} key={item.tid}>
                                    <h1 dangerouslySetInnerHTML={{ __html: item.title }}></h1>
                                    <p dangerouslySetInnerHTML={{ __html: item.content }}>
                                    </p>
                                    <div className="bottom">
                                        <span className="avatar">
                                            <b><img src={item.userBaseInfo.userAvatar} alt="" /></b>
                                            <i>{item.userBaseInfo.userName}</i>
                                        </span>
                                        <p>
                                            {item.lastUpdateTime}
                                        </p>
                                        <div className="sub">
                                            <span>{item.viewsCount}</span>
                                            <i className="yo-ico">&#xe666;</i>
                                            <span>{item.commentsCount}</span>
                                            <i className="yo-ico">&#xe7f5;</i>
                                        </div>
                                    </div>
                                </li>
                            )
                        })
                    }
                </ul>
            </GenralListContainer>
        )
    }
}
